<template>
  <div class="my-report-handle">
    <template>
      <header-bar title="不予受理">
        <template v-slot:backBtn>
          <i @click="$emit('handleChange')" class="iconarrow_back"></i>
        </template>
      </header-bar>
      <div class="handle-content">
        <cube-scroll>
          <div class="handle-opinion">
            <p><span>情况说明<i class="require"></i></span></p>
            <cube-textarea v-model="submitData.message" placeholder="请输入情况说明" :maxlength="200"></cube-textarea>
          </div>
        </cube-scroll>
      </div>
      <div @click="handleSubmit" class="deal-btn">
        提交
      </div>
    </template>
  </div>
</template>

<script>
/**
 * 我的任务事件处理处理页面
 */
import { inadmissibleApi, judgeHandle } from '@/api/eventAPI.js'
import { valiData } from '@/common/js/utils'
export default {
  props: {
    baseData: {
      type: Object,
      default() {
        return []
      }
    }
  },
  data() {
    return {
      submitData: {   //  提交数据
        message: ''
      }
    }
  },
  computed: {
    userInfo() {
      return JSON.parse(window.localStorage.getItem('user'))
    }
  },
  methods: {
    async handleSubmit(){
      let userInfo = this.userInfo
      let eventId = this.$route.query.id
      let userLevel = this.$route.query.orgLevel;
      let userId = userLevel == 4 ? userInfo.userId : userInfo.groupId;
      
      let judge = await judgeHandle(eventId, userId, userLevel);
      if(judge.code !== 0) {
        this.$createToast({
          txt: '该条事件已被处理',
          type: 'error'
        }).show()
        return
      }
      
      let params = {
        "assigner": userLevel,
        "eventId": eventId,
        "groupId": userInfo.groupId,
        "message": this.submitData.message,
        "userId": userId,
        "userName": userInfo.userName,
        "userOrgId": userInfo.groupId,
        "userOrgName": userInfo.groupName
      }
      if(!valiData.call(this,{
        message: {cond: "String($$).trim().length>0", pro: '请输入情况说明'}
      }, params)){
        return false
      }

      this.$createDialog({
        type: 'confirm',
        icon: 'cubeic-alert',
        title: '确认不予受理？',
        confirmBtn: {
          text: '确定'
        },
        cancelBtn: {
          text: '取消'
        },
        onConfirm: async () => {
          const toast = this.$createToast({
            time: 0,
            mask: true,
            txt: '提交中....'
          })
          toast.show()
          // 处理列表分为中队和个人  在退回时需要进行分解
          let eventNode = this.$route.query.eventNode
          if(eventNode == 'dealCase') {
            params.assigner = this.$route.query.orgLevel
          }
          
          let res = await inadmissibleApi(params)
          toast.hide()
          if(res.code == 0){
            this.$createToast({
              txt: '操作成功',
              type: 'txt'
            }).show()
            setTimeout(()=>{
              this.$router.back()
            },500)
          }else{
            this.$createToast({
              txt: '操作失败',
              type: 'error'
            }).show()
          }
        }
      }).show();
    }
  },
  components: {
    'header-bar': () => import('@/components/header-bar/header-bar')
  }
}
</script>

<style lang="stylus">
@import '../../assets/css/image.styl'
.my-report-handle{
  .handle-content{
    height: calc(100vh - 117px);
    .handle-opinion{
      margin-top 10px;
      width: 100%;
      height: 110px;
      background:rgba(255,255,255,1);
      p{
        height: 30px;
        display: flex;
        align-items flex-end;
        font-size:14px;
        font-family:PingFangSC-Regular;
        font-weight:400;
        color:rgba(51,51,51,1);
        text-indent: 12px;
      }
      .cube-textarea-wrapper{
        font-size:14px;
        font-family:PingFangSC-Regular;
        font-weight:400;
        color:rgba(153,153,153,1);
        max-height: 100px;
        .cube-textarea{
          font-size:14px;
          font-family:PingFangSC-Regular;
          font-weight:400;
          color:rgba(153,153,153,1);
          padding-left 15px;
        }
        &::after{
          border: none;
        }
      }
    }
  }
  .bg-white{
    background: #fff;
  }
  .deal-btn{
    position fixed;
    bottom: 15px;
    left 12px;
    width:calc(100% - 24px);
    height:41px;
    background:rgba(4,48,102,1);
    border-radius:4px;
    text-align center;
    line-height 41px;
    font-size:15px;
    font-family:PingFangSC-Regular;
    font-weight:400;
    color:rgba(255,255,255,1);
  }
  .fade-enter-active, .fade-leave-active {
    transition: opacity .5s;
  }
  .fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
    opacity: 0;
  }
  .cube-input{
    input{
      text-align: right
    }
  }
  .require{
    position: relative
    &:before{
      position: absolute
      left: -12px;
      top: 5px;
      content: '*';
      color: #f00;
    }
  }
}
</style>
